import React, { Component } from "react";
import { Overlay } from "react-vant";

import { getChannel } from "../../utils";
import { CampaignIds, HaPopupClosed } from "../../utils/ha.common";
import styles from "./index.module.scss";

class Index extends Component {
  constructor(props) {
    super(props);

    this.state = {
      show: false,
    };
  }

  componentDidMount() {}

  open() {
    this.setState({
      show: true,
    });

    window._ha("send", "action", "cny_activity1_sharepage_view", {
      campaign_id: CampaignIds.activity1,
      channel: getChannel(),
    });
  }

  close() {
    this.setState({
      show: false,
    });

    HaPopupClosed(
      "SharePage",
      "cny_activity1_popupwindow_close",
      CampaignIds.activity1
    );
  }

  render() {
    return (
      <>
        <Overlay
          zIndex={99}
          onClick={() => {
            this.close();
          }}
          visible={this.state.show}
          className={styles.overlayContianer}
        >
          <div className={styles.container}>
            <i
              onClick={() => {
                this.close();
              }}
              className={styles.close}
            ></i>
          </div>
        </Overlay>
      </>
    );
  }
}

export default Index;
